.wrapper-toast
  position fixed
  top 50%
  left 50%
  transform translate(-50%, -50%)
  width 228px
  box-shadow 0px 0px 12px 0px rgba(0, 0, 0, .85)
  border-radius 7px
  background rgba(255, 255, 255, .9)
  animation blur-show ease-out .3s
  .title
    font-size 14px
    font-weight bold
  .input-wrap
    margin-top 8px
    height 30px
    display flex
    .input
      flex 1 1 auto
      input 
        font-size 14px
        box-sizing border-box
        width 100%
        height 100%
        border 1px solid #BCBCBC
        border-right none 
        border-radius 3px 0 0 3px
    .code
      flex 0 0 auto
      border-radius 0 3px 3px 0
      overflow hidden
      height 100%
  .warn-wrap
    margin-top 4px
    display flex
    justify-content space-between
    .iconfont
      color #C25454
      font-size 12px
    .warn-text
      margin-left 4px
      color #BCBCBC
      font-size 12px
    .change
      font-size 12px
      color #424242
      text-decoration underline
      cursor pointer

  .btn-wrap
    margin-top 16px
    display flex
    justify-content flex-end
    .btn 
      cursor pointer
      margin-left 18px
      padding 6px 0 6px 6px
      font-size 14px
      &.cancel
        color #BCBCBC
      &.submit 
        color #2A76DC
        &.lock
          cursor auto
          color #BCBCBC




@media(max-width 600px)
  .wrapper-toast
    padding 16px 16px 8px

      

@media(min-width 600px)
  .wrapper-toast
    width 266px
    padding 24px 24px 12px
    .title
      font-size 16px
    .input-wrap
      margin-top 12px
    .warn-wrap
      margin-top 6px
    .btn-wrap
      margin-top 24px
      .btn
        font-size 16px

@keyframes blur-show {
  0% {
    // filter blur(5px)
    opacity 0
  }
  100% {
    // filter none
    opacity 1
  }
}